<div class="padding-bottom-45">

    <div class="modal-header">
        <div class="modal-title">新增钉钉配置</div>
    </div>

    <form nz-form [formGroup]="form" #validateForm="ngForm" (ngSubmit)="save()" *ngIf="dingTalkConfig">

        <nz-form-item nz-row>
            <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired nzFor="type">配置类型</nz-form-label>
            <nz-form-control nzHasFeedback nz-col [nzSm]="19" [nzErrorTip]="errorTypeTip">
                <nz-select formControlName="type" [nzPlaceHolder]="'配置类型'" [(ngModel)]="dingTalkConfig.type" [nzShowSearch]="true" style="width:100%;">
                    <nz-option *ngFor="let i of DingDingType" [nzLabel]="i.text" [nzValue]="i.value">
                    </nz-option>
                </nz-select>
                <ng-template #errorTypeTip let-control>
                    <ng-container *ngIf="control.hasError('required')">
                        配置类型不能空!
                    </ng-container>
                </ng-template>
            </nz-form-control>
        </nz-form-item>

        <nz-form-item nz-row>
            <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired nzFor="code">编码</nz-form-label>
            <nz-form-control nzHasFeedback nz-col [nzSm]="19" [nzErrorTip]="errorCodeTip">
                <input nz-input formControlName="code" [(ngModel)]="dingTalkConfig.code" id="code">
                <ng-template #errorCodeTip let-control>
                    <ng-container *ngIf="control.hasError('required')">
                        编码不能空!
                    </ng-container>
                </ng-template>
            </nz-form-control>
        </nz-form-item>

        <nz-form-item nz-row>
            <nz-form-label [nzSm]="5" [nzXs]="24" nzFor="value">配置项</nz-form-label>
            <nz-form-control nzHasFeedback nz-col [nzSm]="19" [nzErrorTip]="errorValueTip">
                <input nz-input formControlName="value" [(ngModel)]="dingTalkConfig.value" id="value">
                <ng-template #errorValueTip let-control>
                    <ng-container *ngIf="control.hasError('maxlength')">
                        配置项长度不能超过500个字符!
                    </ng-container>
                </ng-template>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item nz-row>
            <nz-form-label [nzSm]="5" [nzXs]="24" nzFor="remark">备注</nz-form-label>
            <nz-form-control nzHasFeedback nz-col [nzSm]="19" [nzErrorTip]="errorRemarkTip">
                <input nz-input formControlName="remark" [(ngModel)]="dingTalkConfig.remark" id="remark">
                <ng-template #errorRemarkTip let-control>
                    <ng-container *ngIf="control.hasError('maxlength')">
                        配置项长度不能超过500个字符!
                    </ng-container>
                </ng-template>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item nz-row>
            <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzFor="seq">序号</nz-form-label>
            <nz-form-control nzHasFeedback nz-col [nzSm]="19" [nzErrorTip]="errorSeqTip">
                <input nz-input formControlName="seq" [(ngModel)]="dingTalkConfig.seq" id="seq">
                <ng-template #errorSeqTip let-control>
                    <ng-container *ngIf="control.hasError('pattern')">
                        请输入数字
                    </ng-container>
                </ng-template>
            </nz-form-control>
        </nz-form-item>
        <div class="modal-footer">
            <button nz-button type="button" [disabled]="saving" (click)="close()">
        取消
      </button>
            <button nz-button [nzType]="'primary'" type="submit" [disabled]="!validateForm.valid||saving">
        保存
      </button>
        </div>

    </form>
</div>